<style>
.quick{
	height:50px;
	text-align:center;
}
.footer_bar .quick{height:0;}
.quick ul{
	height:50px;
	position:fixed;
	z-index:200;
	bottom:0;
	left:0;
	width:100%;
	background:-webkit-gradient(linear, 0 0, 0 100%, from(#353535), to(#2d2d2d));
}
.quick li>a{
	color:#8c8f94;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
	border-bottom:0;
	display:block;
	height:100%;
	padding:5px 0;
	text-align:center;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
}
.quick li>a.on, .quick li>a.active{
	color:#fff;
	background:-webkit-gradient(radial, 50% 110%, 10, 50% 110%, 30, from(rgba(255,255,255,0.2)), to(transparent));
}
.quick li>a>*{
	pointer-events:none;
}
.quick li>a>p{
	width:25px;
	height:25px;
	margin:auto;
	-webkit-background-size:100px auto;
}
.quick li>a>p[class*="icon"]{
	display: block;
	background: none;
	font-size: 19px;
	line-height: 25px;
}
.quick li>a.on>p, .quick li>a.active>p{
	background-position-x:-63px;
}
.quick-box {
	width: 100%;
	display: -webkit-box;
	display: -moz-box;
	-webkit-box-orient: horizontal;
	-moz-box-orient: horizontal;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}
.quick-box > * {
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
}
</style>
<div class="top_bar footer_bar">
	<div class="quick">
		<ul class="quick-box">
        	{php $i = 1;}
			{loop $_W['quickmenu']['menus'] $nav}
			<li>
				<a href="{$nav['url']}" style="{$nav['css']['icon']['style']}">
					<p class="{$nav['css']['icon']['icon']}"></p>
					<span style="{$nav['css']['name']}">{$nav['name']}</span>
				</a>
			</li>
            {php if($i>=4) break;}
            {php $i++;}
			{/loop}
		</ul>
	</div>
</div>